<template>
  <div>
    <el-card class="box-card detail">
      <el-row :gutter="20">
        <el-col :span="8">
          <img
            class="cover"
            :src="videoInfo.cover_img"
            :title="videoInfo.title"
          />
        </el-col>
        <el-col :span="16">
          <el-row  class="tags">
            <h2>综合评分：{{ videoInfo.point }}</h2>
            <h2>价格：{{ videoInfo.price / 100 }}</h2>
            <h2>上线时间:{{ videoInfo.create_time }}</h2>
          </el-row>
        </el-col>
      </el-row>
    </el-card>
  </div>
</template>

<script>
export default {
  data() {},
  props: {
    videoInfo: {
      type: Object,
      required: true,
    },
  },
};
</script>

<style lang="scss" scoped>
.cover {
  border-radius: 5px;
  max-width: 300px;
  width: 100%;
}
.detail {
  max-width: 100%;
}
.tags{
  margin: 10%;
}
</style>